<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>人员列表演示</title>
	<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
	<link rel="stylesheet" href="/css/bootstrap.min.css">
	<!-- 引入VUEJS文件 -->
	<script src="/js/vue.js"></script>
	<!-- 引入JQUERYJS文件 -->
	<script src="/js/jquery.min.js"></script>	
	<script src="/layer/layer.js"></script>	
</head>
<body>
	<div id="app">
	
	
	<button type="button" class="btn btn-primary" onclick="app.getPagePersons()">查询</button>
	<button type="button" class="btn btn-primary" onclick="app.getPagePersons2()">添加</button>
	<div class="row">
		<div class="col-md-3"></div>
		<div class="col-md-5">
			<table class="table table-bordered">
				<thead>
					<tr>
						<td>商品编号</td>
						<td>商品名称</td>
						<td>商品价格</td>
						<td>库存</td>
						<td>添加时间</td>
						<td>添加人员</td>	
						<td>编辑时间</td>
						<td>编辑人员</td>
						<td>操作</td>
					</tr>
				</thead>
				<tbody>
					<tr v-for="(person, index)  in curPageData">
						<td>{{index+1}}</td>
						<td>{{person.s_name}}</td>
						<td>{{person.s_price}}</td>
						<td>{{person.s_stock}}</td>
						<td>{{person.addtime}}</td>
						<td>{{person.adduser}}</td>
						<td>{{person.edittime}}</td>
						<td>{{person.edituser}}</td>
						<td><a href="javascript:;" v-on:click="delPerson(person.s_id)">删除</a> | <a href="javascript:;" v-on:click="editPerson(person.s_id)">修改</a></td>
					</tr>
				</tbody>
			</table>
		</div>
		<div class="col-md-3"></div>
	</div>
	
	
	</div>
	<script>
	
		var app = new Vue({
		  el: '#app',
		  data: {
			curPageData:[]
		  },
		  methods: {
		  
			getPagePersons: function () {
				//从服务器获取
				//TODO:发送AJAX
				
				$.ajax({
					url:"/user/Like",
					data:{},
					dataType:"json",
					success:function(rs){
						app.curPageData = rs.data;
						//app.delPerson(33);
					}

				});
				
				
				/*
				var serverData = [
					{"code":"121","s_name":"上衣","s_price":120,"s_stock":"10","addtime":"","adduser":"","edittime":"","edituser":""},
					{"code":"122","s_name":"上衣","s_price":24,"s_stock":"13","addtime":","adduser":"","edittime":"","edituser":"""},
				];
				
				this.curPageData = serverData;
				*/
				
			},
			getPagePersons2:function(){
				alert("00");
			
				layer.open({
				  type: 2,
				  title: 'layer mobile页',
				  shadeClose: true,
				  shade: 0.8,
				  area: ['800px', '60%'],
				  content: '/user/add2' 
				});
				
				
			},
			delPerson:function(userid){
				alert("删除人员："+userid);
			},
			editPerson:function(userid){
				alert("修改人员："+userid);
			}
			
			
		  }
		});
	
	
	</script>
</body>
</html>